import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
import { userStore } from '../store'
import { message } from 'ant-design-vue'
import { menu } from '../entity/system/menu'

// 引入所有路由
const routerList = import.meta.globEager('./module/**/*.ts')

const importRouter = Object.keys(routerList)
  .map((key) => routerList[key].default)
  .flat() as Array<RouteRecordRaw>
/**
 * 路由定义
 */
const routes: Array<RouteRecordRaw> = [
  {
    path: '/',
    redirect: '/login',
  },
  {
    path: '/login',
    name: '/login',
    component: () => import('@/views/login/Login.vue'),
  },
  // 管理端路由
  {
    path: '/home',
    name: '/home',
    component: () => import('@/views/home/Index.vue'),
    children: [],
    meta: {
      name: '首页',
    },
  },
  ...importRouter,
]
/*
 * 路由配置
 * */
const router = createRouter({
  // history模式实现,还可以使用hash模式
  // history: createWebHistory(import.meta.env.BASE_URL),
  history: createWebHashHistory(import.meta.env.BASE_URL),
  routes,
})

/**
 * 全局路由守卫
 *
 */
// 前置守卫
router.beforeEach((to, from, next) => {
  document.title = (to.name as string) ?? '基础框架'
  // 忽略登录
  if (to.meta.skipLogin === true) {
    next()
    return
  }
  // 获取用户信息
  const store = userStore()
  // 1、如果前往登录页面，且token存在，直接跳转到首页
  if (to.path == '/login' && store.getToken) {
    next({ name: '/home' })
  }
  // 2、否则就去登录
  if (to.path != '/login' && !store.getToken) {
    message.error('请先登录')
    next({ name: '/login' })
  }
  // 如果是请求其他页面，需要动态加载路由
  if (!store.getIsLoadingDynamicMenu) {
    addDynamicRoute(to, from, next)
    // 用新增的路由替换当前路由
    next({ name: to.path })
  }
  next()
})

// 解析守卫(是获取数据或执行任何其他操作（如果用户无法进入页面时你希望避免执行的操作）的理想位置。)
router.beforeResolve(async (to) => {
  // 放行
  return true
})

// 后置守卫(分析、更改页面标题、声明页面等辅助功能以及许多其他事情)
router.afterEach((to, from) => {
  // 放行
  return true
})
/**
 * 添加动态路由
 */
export function addDynamicRoute(to: any, from: any, next: any) {
  // 获取用户菜单
  const store = userStore()
  let menuRoute = []
  // 存储动态路由
  if (store.getDynamicRoute.length > 0) {
    menuRoute = store.getDynamicRoute
  } else {
    let menu = store.getMenu
    // 将菜单解析成路由
    menuRoute = getRouteByMenu(menu as Array<menu>, [])
    store.setDynamicRoute(menuRoute)
  }
  // 动态添加路由
  menuRoute.map((route) => {
    const endpoint = route.meta.endpoint
    // 管理端路由
    if (endpoint == 0) {
      router.addRoute('/home', route)
    }
    // 用户路由
    if (endpoint == 1) {
      router.addRoute(route)
    }
  })
  store.setIsLoadingDynamicMenu(true)
  // 404
  if (!router.hasRoute(to.fullPath)) {
    next({ name: '/404' })
  }
}

/**
 * 通过菜单数据获取路由(只解析有url的路由)
 * @param data 菜单数据
 * @param routes 创建的路由
 */
// @ts-ignore 通过vite获取所有组件
let modules = import.meta.glob('../views/**/*.vue')
function getRouteByMenu(data: Array<menu>, routes: Array<RouteRecordRaw>): Array<RouteRecordRaw> {
  if (!data || data.length == 0) {
    return []
  }
  let temp = [] as Array<menu>
  for (let i = 0; i < data.length; i++) {
    if (data[i].children && data[i].children.length > 0 && data[i].children[0].type != 2) {
      // 子菜单存在，加入
      temp = temp.concat(data[i].children as Array<menu>)
    } else if (data[i].url && /\S/.test(data[i].url as string)) {
      // 去掉\
      data[i].url = data[i].url?.replace(/^\//, '')
      // 创建路由
      let route = {
        path: '/' + data[i].url,
        component: null,
        name: '/' + data[i].url,
        meta: {
          ...data[i],
        },
      }
      // 动态加载路由
      // @ts-ignore
      let array = data[i].url.split('/')
      let url = ''
      for (let i = 0; i < array.length; i++) {
        if (i == array.length - 1) {
          url += array[i] + '/' + array[i].substring(0, 1).toUpperCase() + array[i].substring(1)
        } else {
          url += array[i] + '/'
        }
      }
      // @ts-ignore
      route.component = modules[`../views/${url}.vue`]
      routes.push(route as unknown as RouteRecordRaw)
    }
  }
  if (temp.length > 0) {
    getRouteByMenu(temp, routes)
  }
  return routes
}
export default router
